import React from 'react';
import { Button } from 'antd-mobile';
import { useNavigate } from 'react-router-dom';

const NotFound = () => {
  const navigate = useNavigate();
  
  return (
    <div style={{ textAlign: 'center', padding: '40px 20px' }}>
      <h1 style={{ fontSize: '100px', color: '#1890ff' }}>404</h1>
      <p style={{ fontSize: '24px', margin: '20px 0' }}>页面未找到</p>
      <p style={{ marginBottom: '30px', color: '#666' }}>
        您访问的页面不存在或已被移除
      </p>
      <Button 
        type="primary" 
        onClick={() => navigate('/')}
        style={{ width: '200px' }}
      >
        返回首页
      </Button>
    </div>
  );
};

export default NotFound;